/**
 * VUEshop
 * ============================================================================
 * * 版权所有 2015-2027 深圳搜豹网络科技有限公司，并保留所有权利。
 * 网站地址: http://www.vueshop.com.cn
 * ----------------------------------------------------------------------------
 * 这不是一个自由软件！您只能在不用于商业目的的前提下对程序代码进行修改和使用 .
 * 不允许对程序代码以任何形式任何目的的再发布。
 * ============================================================================
 * $Author: soubao-java 2020-07-22 $
 */<template>
 <div>
     <div>
      <div class="fixed-bar">
          <div class="item-title"><router-link class="back" :to="{name:'collocation'}" title="返回列表"><i class="fa fa-arrow-circle-o-left"></i></router-link>
              <div class="subject">
                  <h3>搭配购套餐管理 - 编辑套餐</h3>
                  <h5>查看/编辑搭配购套餐</h5>
              </div>
          </div>
      </div>
		<el-form label-position="left" label-width="80px" style="padding-top: 30px;" :model="form">
			<el-form-item label="套餐名称" style="width: 300px;" required>
				<el-input v-model="form.title"></el-input>
			</el-form-item>
			<el-form-item label="开始时间" required>
				<el-date-picker v-model="beginTime" type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" placeholder="选择日期时间"></el-date-picker>
			</el-form-item>
			<el-form-item label="结束时间" required>
				<el-date-picker v-model="endTime" type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" placeholder="选择日期时间"></el-date-picker>
			</el-form-item>
			<el-form-item label="套餐描述" required>
				<el-input type="textarea" v-model="form.desc" style="width:350px"></el-input>
			</el-form-item>
			<el-form-item label="套餐商品" required>
			</el-form-item>
			<el-table :data="form.combination_goods" style="width: 100%">
				<el-table-column label="商品ID" width="80" prop="goods_id"></el-table-column>
				<el-table-column label="商品名称" width="120" prop="goods_name" show-overflow-tooltip></el-table-column>
				<el-table-column label="商品图片" width="80">
					<template scope="scope">
					  <img :src="scope.row.goods_img" width="40" height="30" />
					</template>
				</el-table-column>
				<el-table-column label="商品类型" width="90">
					<template slot-scope="scope">
						<span v-if="scope.row.is_master">主商品</span>
						<span v-else>副商品</span>
					</template>
				</el-table-column>
				<el-table-column label="规格" width="100" prop="key_name"></el-table-column>
				<el-table-column label="库存" width="80" prop="goods_count"></el-table-column>
				<el-table-column label="成本价格（元）" width="100" prop="cost_price"></el-table-column>
				<el-table-column label="商城价格（元）" width="100" prop="original_price"></el-table-column>
				<el-table-column label="优惠价格（元）">
					<template slot-scope="scope">
						<el-input v-model="scope.row.price" style="width: 55px;"></el-input>
					</template>
				</el-table-column>
			</el-table>
		</el-form>
     </div>
 </div>
</template>

<script>
	import {
		getCombination
	} from "@/utils/api";
	export default {
			data() {
				return {
					combination_id: this.$route.params.id,
					beginTime: null,
					endTime: null,
					form: {
						combination_goods: []
					},
				}
			},
			components: {
	
			},
			created() {
				this.getCombination();
			},
			methods: {
				getCombination() {
					var that = this;
					getCombination(this.combination_id).then(function(res) {
						that.form = res;
						that.beginTime = that.form.start_time * 1000;
						that.endTime = that.form.end_time * 1000;
					})
				},
			}
		}
</script>

<style scoped>
>>>.el-input--prefix .el-input__inner {
    padding-left: 30px;
    width: 200px;
}
>>>.el-icon-circle-close:before {
	content: "\e78d";
	margin-left: -30px;
}
 
</style>
